<template>
	<div style="width:100%;height:74vh;position:relative;">
		<div id="meeting-record" v-if="answerlist.length!=0" style="display: none;">
			<table width="100%" cellspacing="0" cellpadding="0" style="border:solid 1px #000;">
				<tr>
					<th style="border-bottom:solid 1px #000;border-right:solid 1px #000;height:40px;">学校</th>
					<th style="border-bottom:solid 1px #000;border-right:solid 1px #000;height:40px;">学科</th>
					<th style="border-bottom:solid 1px #000;border-right:solid 1px #000;height:40px;">题号</th>
					<th style="border-bottom:solid 1px #000;border-right:solid 1px #000;height:40px;">教师</th>
					<th style="border-bottom:solid 1px #000;border-right:solid 1px #000;height:40px;">总量</th>
					<th style="border-bottom:solid 1px #000;border-right:solid 1px #000;height:40px;">剩余</th>
					<th style="border-bottom:solid 1px #000;height:40px;">进度</th>
				</tr>
				<tr v-for="(item,index) in answerlist" :key="index">
					<td style="border-bottom:solid 1px #000;border-right:solid 1px #000;text-align: center;">{{item.schoolname}}</td>
					<td colspan="6">
						<table width="100%" cellspacing="0" cellpadding="0" style="border:none;">
							<tr v-for="xueke in item.nums">
								<td v-if="xueke.rtis[0]" style="border-bottom:solid 1px #000;border-right:solid 1px #000;text-align: center;">{{xueke.rtis[0].navname}}</td>
								<td colspan="5" v-if="xueke.rtis.lenght!=0">
									<table width="100%" cellspacing="0" cellpadding="0" style="border:none;">
										<tr v-for="questionlist in xueke.rtis">
											<td style="border-bottom:solid 1px #000;border-right:solid 1px #000;text-align: center;">{{JSON.stringify(questionlist.sourcename3)}}</td>
											<td style="border-bottom:solid 1px #000;border-right:solid 1px #000;text-align: center;">
												<!-- {{questionlist.teachernames}} -->
												<div v-for="items in questionlist.teachers" :key="items.phoneNumber">{{ items.teacherName }}({{ items.phoneNumber }})</div>
											</td>
											<td style="border-bottom:solid 1px #000;border-right:solid 1px #000;text-align: center;">{{questionlist.numbynav}}</td>
											<td style="border-bottom:solid 1px #000;border-right:solid 1px #000;text-align: center;">{{questionlist.untasknum}}</td>
											<td style="border-bottom:solid 1px #000;padding:0 20px;text-align: center;"><el-progress :stroke-width="10" :percentage="parseInt(questionlist.tasknum/questionlist.numbynav*100)"></el-progress></td>
										</tr>
									</table>
								</td>
							</tr>
						</table>
					</td>
				</tr>
			</table>
		</div>
		<loadingView :title="loadingtitle" v-if="loadingIshow"></loadingView>
		<div v-if="answerlist.length==0&&loadingIshow==false">
			<div class="emptyBoxset">
				<img src="../../../assets/image/empty6.png" style="width:150px;" />
				<span>抱歉，当前栏目下没有内容！</span>
			</div>
		</div>
		<div class="tablebox" v-else>
			<h3 class="reportTitle">
				<p>各学校阅卷进度</p>
				<!-- <JsonExcel
						class="export-excel-wrapper"
						:data="answerlist"
						:fields="json_fields"
						:header="title"
						:name="title+'.xls'"
					  >
					<el-button class="exprtBtn" type="primary" plain>导出</el-button>
				</JsonExcel> -->
				<el-button class="exprtBtn" type="primary" plain @click="exportexcels">导出</el-button>
			</h3>
			<div v-if="answerlist.length!=0">
				<table width="100%" cellspacing="0" cellpadding="0" >
					<tr>
						<th width="180">学校</th>
						<th width="80">学科</th>
						<th width="80">题号</th>
						<th>教师</th>
						<th width="100">总量</th>
						<th width="100">剩余</th>
						<th width="150">进度</th>
					</tr>
					<tr v-for="(item,index) in answerlist" :key="index">
						<td>{{item.schoolname}}</td>
						<td colspan="6" style="border-right:none;">
							<table width="100%" cellspacing="0" cellpadding="0" style="border:none;">
								<tr v-for="xueke in item.nums">
									<td width="80" v-if="xueke.rtis[0]">{{xueke.rtis[0].navname}}</td>
									<td colspan="5" v-if="xueke.rtis.lenght!=0">
										<table width="100%" cellspacing="0" cellpadding="0" style="border:none;">
											<tr v-for="questionlist in xueke.rtis">
												<td width="90">{{questionlist.sourcename3}}</td>
												<td width="338">
													<!-- {{questionlist.teachernames}} -->
													
												<div v-for="items in questionlist.teachers" :key="items.phoneNumber">{{ items.teacherName }}({{ items.phoneNumber }})</div>
												</td>
												<td width="111">{{questionlist.numbynav}}</td>
												<td width="110">{{questionlist.untasknum}}</td>
												<td style="padding:0 10px;border-right:none;" width="142"><el-progress :stroke-width="10" :percentage="parseInt(questionlist.tasknum/questionlist.numbynav*100)"></el-progress></td>
											</tr>
										</table>
									</td>
								</tr>
							</table>
						</td>
					</tr>
				</table>
			</div>
			<!-- <table width="100%" cellspacing="0" cellpadding="0" >
				<tr>
					<th width="180">学校</th>
					<th width="80">学科</th>
					<th width="80">题号</th>
					<th>教师</th>
					<th width="100">总量</th>
					<th width="100">剩余</th>
					<th width="150">进度</th>
				</tr>
				<tr v-for="(item,index) in answerlist" :key="index">
					<td :rowspan="item.nums.length">{{item.schoolname}}</td>
					<td colspan="6">
						<table width="100%" cellspacing="0" cellpadding="0" style="border:none;">
							<tr v-for="xueke in item.nums">
								<td width="80" v-if="xueke.rtis[0]">{{xueke.rtis[0].navname}}</td>
								<td width="80" v-else>&nbsp;</td>
								<td colspan="5" v-if="xueke.rtis.lenght!=0">
									<table width="100%" cellspacing="0" cellpadding="0" style="border:none;">
										<tr v-for="questionlist in xueke.rtis">
											<td width="90">{{questionlist.sourcename3}}</td>
											<td width="338">{{questionlist.teachernames}}</td>
											<td width="111">{{questionlist.allnumbynav}}</td>
											<td width="110">{{questionlist.untasknum}}</td>
											<td style="padding:0 10px;" width="142"><el-progress :stroke-width="10" :percentage="parseInt(questionlist.tasknum/questionlist.allnumbynav*100)"></el-progress></td>
										</tr>
									</table>
								</td>
								<td colspan="5" v-else>
									<table width="100%" cellspacing="0" cellpadding="0" style="border:none;">
										<tr>
											<td width="90">&nbsp;</td>
											<td width="338">&nbsp;</td>
											<td width="111">&nbsp;</td>
											<td width="110">&nbsp;</td>
											<td style="padding:0 10px;" width="142">&nbsp;</td>
										</tr>
									</table>
								</td>
							</tr>
						</table>
					</td>
				</tr>
			</table> -->
		</div>
	</div>
</template>

<script>
	import navTop from "../../../components/head.vue"
	import {gradingprogressjk2} from '../../../api/api.js'
	import JsonExcel from 'vue-json-excel'
	  import loadingView from '../../../components/loading.vue'
	  
	export default{
		data(){
			return{
				screenWidth:'',
				answertableth:[],
				answerlist:[],
				title:'',
				loadingtitle:'',
				loadingIshow:false,
				// json_fields:{
				// 	'学校名称': 'schoolname',
				// 	'年级': 'gradename',
				// 	'负责人姓名': 'company',
				// 	'负责人电话':'telephone',
				// 	'语文':'score0',
				// 	'数学':'score1',
				// 	'英语':'score2',
				// 	'物理':'score3',
				// 	'化学':'score4',
				// 	'生物':'score5',
				// 	'历史':'score6',
				// 	'地理':'score7',
				// 	'政治':'score8'
				// },
				result:[{scholl:'1'},{scholl:'2'},{scholl:'3'}],
			}
		},
		mounted() {
			this.title= this.$route.query.title
			this.screenWidth = document.body.clientWidth
			// if(sessionStorage.getItem('ssss')){
			// 	// this.answertableth = res.list1
			// 	let list = JSON.parse(sessionStorage.getItem('ssss'))
			// 	// let listarry=[]
			// 	list.map(item=>{
			// 		item.nums.map((num,index)=>{
			// 			let listobj = num.rtis.filter(rtis=> rtis.untasknum!=0)
			// 			item.nums[index].rtis=listobj
			// 		})
			// 	})
			// 	list.map((item,index)=>{
			// 		let listobjs = item.nums.filter(num=>num.rtis.length!=0)
			// 		list[index].nums=listobjs
			// 	})
			// 	console.info(list)
			// 	this.answerlist = JSON.parse(sessionStorage.getItem('ssss'))
			// }else{
				this.answerprogressjkclick(this.$route.query.navid)
			// }
			
		},
		methods:{
			exportexcels(){
				 const html = document.getElementById("meeting-record").innerHTML; // 获取需要导出的HTML内容
				  const blob = new Blob([html], { type: "application/vnd.ms-excel;charset=utf-8" }); // 创建Blob对象
				  saveAs(blob, "各学校阅卷进度.xlsx"); // 调用保存文件函数进行下载
			},
			xuekeProgresslook(groupid,nav6id,school){
				if(nav6id!=0){
					this.$router.push('/progressstatistics/smallquestionprogress?groupid='+groupid+'&nav6id='+nav6id+'&school='+school+'&title='+this.$route.query.title+'&type='+this.$route.query.type+'&navid='+this.$route.query.navid)
				}else{
					this.$message.error('当前学科未开始阅卷！')
				}
			},
			answerprogressjkclick(id){
				this.loadingtitle='数据努力加载中...'
				this.loadingIshow=true
				let params = {
					navId:id
				}
				gradingprogressjk2(params).then(res=>{
					this.answertableth = res.list1
					this.answerlist = res.list2
					console.log(res.list2,'888888888888888888');
					// let list=res.list2
					// list.map(item=>{
					// 	item.nums.map((num,index)=>{
					// 		let listobj = num.rtis.filter(rtis=> rtis.untasknum>0)
					// 		item.nums[index].rtis=listobj
					// 	})
					// })
					// list.map((item,index)=>{
					// 	let listobjs = item.nums.filter(num=>num.rtis.length!=0)
					// 	list[index].nums=listobjs
					// })
					// sessionStorage.setItem('ssss',JSON.stringify(res.list2))
					this.loadingtitle=''
					this.loadingIshow=false
					console.log(this.answerlist,'9999999999999999999');
					// console.info(res.list2)
				// 	for(let i=0; i< res.list2.length; i++) {
				//         let obj = {};
				//         let one = res.list2[i];
				// //         obj.studentname = one.studentname;
				// //         obj.subjectscore = one.subjectscore;
				//         for (let j=0; j< one.nums.length; j++) {
				//             let rs = one.nums[j];
							
				// 			// obj['wscore'+rs.sourename] = rs.score;
				// 			obj['score'+j] = JSON.stringify(rs.jindu);
				//         } 
				// 		this.result.push({...one,...obj})
				//     }
				// 	for(let i=0; i< res.list1.length; i++) {
				//         let objname = {};
				//         let onename = res.list1[i];
				// 		console.info(onename)
				// 	}
				// 	// this.answerlist = res.list2
				// 	console.info(this.result)
				// 	this.answerlist = this.result
				})
			}
		},
		components:{navTop,JsonExcel,loadingView}
	}
</script>

<style scoped>
	.tablebox{
		box-sizing: border-box;
		background:#fff;
		margin:15px auto;
		padding:20px;
		min-height:74vh;
	}
	.tablebox table{
		border-top:solid 1px #C5D5F4;
		border-left:solid 1px #C5D5F4;
	}
	.tablebox table tr td,.tablebox table tr th{
		border-bottom:solid 1px #C5D5F4;
		border-right:solid 1px #C5D5F4;
		text-align: center;
		line-height:48px;
	}
	.tablebox table tr th{
		background:#EAF1FF 100%;
		font-size:16px;
		color:#333;
		font-weight:normal;
	}
	.reportTitle{
		font-size:16px;
		font-weight: normal;
		padding-bottom:20px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.reportTitle span{
		font-size:14px;
		color:#999;
		display: inline-block;
		padding-left:10px;
	}
	.emptyBoxset{
		text-align: center;
		position:absolute;
		left:50%;
		top:50%;
		transform: translate(-50%,-50%);
	}
	.emptyBoxset span{
		display: block;
		font-size:14px;
		padding-top:20px;
	}
	.emptyBoxset img{
		width:200px;
		height:auto;
	}
</style>